'use strict';
(function() {
    var interval = null;
    var scrollNode = null;
    // idx: 需要添加滚动的文字在第几个div <div id>
    //                                      <div></div>
    //                                      <div idx>需要滚动</div>
    //                                    </div>
    function focusScroll(id, idx) {
        if (id) {
            var scroll = document.getElementById(id);
            var divs = scroll.children;
            if (scroll.getElementsByTagName("p")[0] && !idx && divs.length<2) {
                scroll = scroll.getElementsByTagName("p")[0];
            } else if(idx != undefined && idx != null) {
                scroll = scroll.children[idx];
            } else {
                scroll = scroll.children[divs.length-1];
            }
            var text = scroll.innerHTML;
            if (scroll.getElementsByTagName('span').length < 1) {
                scroll.innerHTML = '<span class="con1">' + text + '</span><span class="con2" style="display:none;"></span>';
            }
            var div1 = scroll.getElementsByClassName('con1')[0];
            var div2 = scroll.getElementsByClassName('con2')[0];
            // 如果文字超出可显示范围，则开始滚动
            if (div1.offsetWidth >= scroll.offsetWidth) {
                div2.style.display = 'inline'
                div2.innerHTML = div1.innerHTML;
                scrollNode = scroll;
                interval = setInterval(function() {
                    if (div1.offsetWidth <= scroll.scrollLeft) {
                        scroll.scrollLeft -= div1.offsetWidth + 40;
                    } else {
                        scroll.scrollLeft += 2;
                    }
                }, 50);
            }
        }
    }

    function onblurStopScroll() {
        clearInterval(interval);
        if (scrollNode) {
            scrollNode.scrollLeft = 0;
        }
    }

    // 不停止滚动
    function continueScroll(id) {
        var scroll = document.getElementById(id).getElementsByTagName("p")[0];
        var text = scroll.innerHTML;
            if (scroll.getElementsByTagName('span').length <= 1) {
                scroll.innerHTML = '<span class="con1">' + text + 
                '</span><span class="con2"></span>';
            }
            var div1 = scroll.getElementsByClassName('con1')[0];
            var div2 = scroll.getElementsByClassName('con2')[0];
            // 如果文字超出可显示范围，则开始滚动
            if (div1.offsetWidth >= scroll.offsetWidth) {
                div2.style.display = 'inline';
                div2.innerHTML = div1.innerHTML;
                setInterval(function() {
                    if (div1.offsetWidth <= scroll.scrollLeft - 40) {
                        scroll.scrollLeft -= div1.offsetWidth + 40;
                    } else {
                        scroll.scrollLeft += 2;
                    }
                }, 50);
            }
    }

    window.focusScroll = focusScroll;
    window.onblurStopScroll = onblurStopScroll;
    window.continueScroll = continueScroll;
})();
